// 作者：王晓政 （小政同学）
// 邮箱：3415278922@qq.com 
// 时间：2024年07月15日
// 博客：http://halo.axz99.cn/
// 欢迎大家来访问我的博客！
(function(){
    const canvas = document.getElementById('canvad');
    // console.log(canvas);
    const ctx = canvas.getContext("2d");
  
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;

    const part = 100;
    const line = 120;
    const colorRgb = '245,250,224';
    let particles = [];
    let interaction = null;

    class Particle{
        constructor(x,y,vex,vey,size,color){
            this.x = x;
            this.y = y;
            this.vex = vex;
            this.vey = vey;
            this.size = size;
            this.color = color;
        }
        draw(){
            ctx.beginPath();
            ctx.arc(this.x,this.y,this.size,0,Math.PI * 2);
            ctx.fillStyle = this.color;
            ctx.fill();
        }
        update(){
            if(this.x < 0 || this.x>canvas.width){
                this.vex *= -1;
                this.vey *= -1;
            }
            if(this.y < 0 || this.y>canvas.height){
                this.vey *= -1;
            }
            this.x += this.vex;
            this.y += this.vey;
            this.draw();
        }
    }

    function getRand(min,max){
        return Math.random() * (max - min) + min ;
    }

    function creatPart(){
        for(let i = 0 ; i <part; i++){
            let size = getRand(1,3);
            let x = Math.random() * canvas.width ;
            let y = Math.random() * canvas.height ;
            let velox = getRand(-2,2);
            let veloy = getRand(-2,2);
            let color = `rgba(${colorRgb},${1 - size / 3})`;
            particles.push(new Particle(x,y,velox,veloy,size,color));
    }
    }

    function connnect(){
        for (let i = 0; i < particles.length; i++) {
            for(let j = i+1 ; j<particles.length ; j++){
                const p1 = particles[i];
                const p2 = particles[j];
                let distance = Math.sqrt(Math.pow(p1.x - p2.x,2) + Math.pow(p1.y - p2.y,2));
                if(distance < line){
                    ctx.strokeStyle =  `rgba(${colorRgb},${1 - distance / line})`;
                    ctx.beginPath();
                    ctx.lineWidth = .8;
                    ctx.moveTo(p1.x,p1.y);
                    ctx.lineTo(p2.x,p2.y);
                    ctx.stroke();
                }
            }
            
        }
    }

    function animate(){
        requestAnimationFrame(animate);
        ctx.clearRect(0,0,canvas.width,canvas.height);
        particles.forEach(particle =>{
            particle.update();
        })
        connnect();
    }

    function bindEvents(){
        canvas.addEventListener('mouseover',e =>{
            if(!interaction){
                interaction = new Particle(e.x,e.y,0,0,2,`rgba(${colorRgb},1)`);
                particles.push(interaction);
            }
        });
        canvas.addEventListener('mousemove',e =>{
            interaction.x = e.x;
            interaction.y = e.y;

        });

        canvas.addEventListener('mouseout',e =>{
            interaction.x = null;
            interaction.y = null;
            
        });
    }
    bindEvents();
    creatPart();
    animate();
}())